<template>
    <div class="swipe-container">
        <!-- lazy-render开启懒加载 -->
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
            <van-swipe-item v-for="it in listStore.filterList(5)">
                <img :src="it.img" :alt="it.name" />
            </van-swipe-item>

        </van-swipe>
    </div>
</template>

<script setup>
import useListStore from '@/store'
const listStore = useListStore()

</script>

<style lang="scss" scoped>
.swipe-container {
    height: 0;
    font-size: 0;
    padding-bottom: 66.6666667%; // 宽高比
}

.my-swipe .van-swipe-item {
    img {
        width: 100%;
        height: 100%;
    }
}
</style>